// Background for nav and hero
.nav-hero-container {
    *[id]:before {
      display: block;
      content: " ";
      margin-top: -1em;
      height: 1em;
      visibility: hidden;
    }


  background: $mainBrandColor linear-gradient(to right, $mainBrandColor, $secondBrandColor) no-repeat center/cover;
  z-index: 9010;
  position: relative;
}

// Landing page hero
.hero {
  position: relative;
  text-align: center;

  .logo {
    margin-bottom: $spacing--l;
  }

  .hero-lead {
    color: $white;
    display: block;
    font-size: 18px;
    margin-top: 0;
    margin-bottom: $spacing--l;
    font-weight: 300;
  }
}
